<template>
  <div class="myHeader-container">
      <div class="header">
            <div>
                <div class="left">
                    <i></i>
                </div>
            </div>
            <div class="logo">
                我的团长
            </div>
        </div>
      <div class="busiCommit">
            <h4>- 专属服务团长 -</h4>
            <div class="face">
                <i></i>
            </div>
            <div class="commitbtn">
                陈团长
            </div>
                <p class="connect">
                    <mt-button size="normal" type="danger" class="combtn">
                        联系团长
                    </mt-button>
                    <i></i>
                </p>
        </div>
  </div>
</template>
<script>
</script>
<style scoped lang="less">
.header {
  color: #000;
  background-color: #fff;
  .logo {
    a {
      display: inline-block;
      width: 131/37.5rem;
      height: 42/37.5rem;
      margin-top: 18/37.5rem;
    }
  }
  .left {
    position: absolute;
    left: 32/37.5rem;
    top: 35/37.5rem;
    height: 32/37.5rem;
    line-height: 32/37.5rem;
    a {
      font-size: 32/40rem;
    }
    i {
      display: inline-block;
      width: 22/37.5rem;
      height: 30/37.5rem;
      background: url(../../../assets/images/index/gengduo@2x.png) no-repeat;
      background-size: contain;
      transform: rotate(180deg);
    }
  }
}
.busiCommit {
  background-color: #fff;
  margin-top: 26/37.5rem;
  padding: 32/37.5rem;
  padding-bottom: 60/37.5rem;
  box-sizing: border-box;
  h4 {
    padding-top: 31/37.5rem;
    font-size: 32/37.5rem;
    margin-bottom: 39/37.5rem;
  }
  i {
    display: inline-block;
    width: 142/37.5rem;
    height: 142/37.5rem;
    // margin-right: 100/37.5rem;
  }
  .face {
    i:nth-of-type(1) {
      background: url(../../../assets/images/index/touxiang-l.png) no-repeat;
      background-size: cover;
    }
  }
  .commitbtn {
    padding: 10/37.5rem 0;
    background-color: #fff;
    font-size: 36/37.5rem;
  }
  p {
    font-size: 26/37.5rem;
    color: #555;
  }
  .mint-button {
    width: 260/37.5rem;
    height: 68/37.5rem;
    font-size: 28/37.5rem;
    text-align: right;
    padding-right: 53/37.5rem;
  }
  .combtn {
    background-color: #d8b78d;
  }
  .connect {
      display: inline-block;
      position: relative;
      margin-top: 22/37.5rem;
      i {
          width: 30/37.5rem;
          height: 30/37.5rem;
          position:absolute;
          left: 53/37.5rem;
          top: 50%;
          transform: translateY(-50%);
          background: url(../../../assets/images/index/touxiang-l.png) no-repeat;
          background-size: cover;
      }
  }
}
</style>
